<!DOCTYPE html>
<html>
  <head> 
    <meta charset="utf-8" /> 
    <meta name="Keywords" content="" /> 
    <meta name="description" content="" /> 
    <meta name="viewport" content="width=device-width,initial-scale=1.0" /> 
    <meta content="width=640,target-densitydpi=device-dpi,user-scalable=no" name="viewport" /> 
    <link type="text/css" href="css/style2.css" rel="stylesheet" /> 
    <script type="text/javascript" src="js/jquery-1.11.2.js"></script>
	<script type="text/javascript" src="js/custom_min.js"></script> 
    <script type="text/javascript" src="js/game2.js"></script> 
  </head> 
  <body> 
    <div class="wrap">
      <div class="game_bg">
        <!-- 第一次进入游戏引导-->
        <div class="game_tip_bg" style="display:none;">
          <div class="game_tip">
            <img src="images/game_tip.png"> 
          </div>
          <div class="game_tip_btn">
            <img src="images/game_tip_btn.png">
          </div>
        </div>
        <!-- 时间不足弹框-->
        <div class="game_tip_bg" style="display:none;">
          <div class="time_over">
            <img src="images/light1.png" class="light">
            <img src="images/time_over.png" class="over">
            <div class="over_time">123456</div>
            <div class="get_gift">
              <a href="#">
                <img src="images/get_gift.png">
              </a>   
            </div>
            <div class="time_over2">
                <img src="images/time_over2.png">
            </div>
          </div>
        </div>
        <div class="game_music mplay">
          <audio autoplay loop id="radio" src="http://www.eyee.cn/Public/Upload/audio/000/000/000/552b97439e0f4.mp3"></audio>
        </div>
		<audio id="play_mp" src="http://dx.sc.chinaz.com/Files/DownLoad/sound1/201403/4228.mp3?qq-pf-to=pcqq.discussion"></audio>
        <div class="game_top"> 
          <div class="score" id="game_score">
            0
          </div> 
          <div class="best_score">
            999999
          </div> 
        </div>
		<!-- 倒计时 -->
        <div class="game_time" id="game_timer">
			<div class="time_bar">
                <span><img src="images/bar_light.png"></span>
            </div>
        </div> 
        <div class="game_board"> 
        <ul id="game_main">
          <li>
            <div class="bug"><img class="a_1" src="images/a_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_2" src="images/a_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_1" src="images/b_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_2" src="images/b_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_1" src="images/c_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_2" src="images/c_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_3" src="images/c_3.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_1" src="images/a_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_2" src="images/a_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_1" src="images/b_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_2" src="images/b_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_1" src="images/c_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_2" src="images/c_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_3" src="images/c_3.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug" data-name="a_1"><img class="a_1" src="images/a_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_2" src="images/a_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_1" src="images/b_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_2" src="images/b_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_1" src="images/c_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_2" src="images/c_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_3" src="images/c_3.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_1" src="images/a_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_2" src="images/a_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_1" src="images/b_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_2" src="images/b_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_1" src="images/c_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_2" src="images/c_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_3" src="images/c_3.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_1" src="images/a_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_2" src="images/a_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_1" src="images/b_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="b_2" src="images/b_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_1" src="images/c_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_2" src="images/c_2.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="c_3" src="images/c_3.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
          <li>
            <div class="bug"><img class="a_1" src="images/a_1.png" /></div> 
            <div class="fire"><img src="images/fire.png" /></div> 
            <div class="light"><img src="images/light.png" /></div>
            <div class="net"><img src="images/net.png" /></div> 
            <div class="cleaner"><img src="images/cleaner.png" /></div>
          </li>
        </ul> 
        <div class="clear"></div> 
        </div> 
        <div class="game_btn"> 
          <div class="game_btn_fire game_btn_bottom" onclick="doFlicker(this, 'fire')"> 
            <div class="btn_fire"></div> 
            <div class="btn_fire disable"></div> 
          </div> 
          <div class="game_btn_net game_btn_bottom" onclick="doFlicker(this, 'net')"> 
            <div class="btn_net"></div> 
            <div class="btn_net disable"></div> 
          </div> 
          <div class="game_btn_cleaner game_btn_bottom" onclick="doFlicker(this, 'cleaner')">
            <div class="btn_cleaner"></div>
            <div class="btn_cleaner disable"></div>
          </div>
          <div class="game_btn_tip">
            <img src="images/tip1.png">
            <img src="images/tip2.png">
            <img src="images/tip3.png">
          </div>
        </div>
          
      </div> 
        
    </div> 
    <!-- 点击后按钮出现进度条效果--> 
    <script type="text/javascript">
		$(window).load(function(){
			$("<link>").attr({ rel: "stylesheet", type: "text/css",href: "css/animate2.css" }).appendTo("head"); 
		});
		
		//用touchstart代替click 增加触摸效率
		$(document).on("touchstart", ".bug", function (e) {
			doCleanUp(this);
			return false;
		});
		
      //音乐按钮控制
      var sj_music = true;
      var music = document.getElementById("radio");
      $(".mplay").click(function(){
        if(sj_music){
          $(this).css("background-image","url(images/musicoff.png)");
          music.pause();
          sj_music = false;
        }else{
          $(this).css("background-image","url(images/musicon.png)");
          music.play();
          sj_music = true;
        }
      });
       //点击按钮出现按钮提示
        $(".game_btn_bottom").click(function(){
            if($(this).hasClass("opacity")){
                return false;
            }else{
                var index = $(this).index();
                $(".game_btn_tip img").eq(index).show().siblings("img").hide();
            }
        });
    </script>
  </body>
</html>